<template>
	<view class="my-message">
		<view class="messagebox" v-for="item in messageArr" :key="item.id">
			<view class="message-time">时间：{{ item.create_time }}</view>
			<view class="message-text">{{ item.context }}</view>
		</view>
		<view class="no-message" v-if="messageArr.length === 0">
			暂无消息
		</view>
	</view>
</template>

<script>
	import { myMessage } from '../utils/methods.js'
	export default {
		data() {
			return {
				messageArr: []
			}
		},
		methods: {
			handleGetMyMessage() {
				myMessage().then(res => {
					if(res.data.code === 0) {
						this.messageArr = res.data.data
					}
				})
			}
		},
		mounted() {
			this.handleGetMyMessage()
		}
	}
</script>

<style lang="less">
.my-message {
	padding: 10px 10rpx;
	box-sizing: border-box;
	.messagebox {
		border: 1px solid #f3f3f3;
		padding: 20rpx;
		margin-bottom: 20rpx;
		border-radius: 5px;
		.message-time {
			font-weight: 600;
			color: black;
		}
		.message-text {
			margin-top: 20rpx;
			color: #5e6d82;
			font-size: 30rpx;
			.title {
				font-weight: 600;
				color: black;
				font-size: 40rpx;
			}
		}
	}
	.no-message {
		width: 100%;
		text-align: center;
		font-weight: 600;
		padding: 40rpx;
	}
}
</style>
